<template>
  <el-dialog
    :title="'机构分配'" :close-on-click-modal="false" :visible.sync="visible" width="1300px" top="8vh"
    @close="clearDataList()">
    <div style="height: 75vh; overflow-y: auto;padding: 20px;">
      <div style=" height: 50px; border-bottom: 1px solid #b0bde2">
        <el-checkbox-group v-model="checkList" @change="cChange">
          <el-checkbox label="月奖"></el-checkbox>
          <el-checkbox label="季度奖"></el-checkbox>
          <el-checkbox label="总经理嘉奖"></el-checkbox>
        </el-checkbox-group>
      </div>
      <div style="margin: 15px 0 0 0;float: right">
        <el-button type="primary" class="marginLeft">导入</el-button>
        <el-button type="primary" class="marginLeft">公式调整</el-button>
        <el-button type="primary" class="marginLeft">分配对象调整</el-button>
        <el-button type="primary" class="marginLeft" @click="btnYs">分配预算</el-button>
        <el-button type="primary" class="marginLeft">保存</el-button>
        <el-button type="primary" class="marginLeft">提交</el-button>
      </div>
      <div>&nbsp;</div>
      <div>&nbsp;</div>
      <div v-show="checkList.indexOf('月奖') > -1">
        <el-form :inline="true" :model="dataForm" class="form-inline">
          <el-form-item label="月奖总额" label-width="122px">
            <el-input style="width: 90%" onkeyup="value=value.replace(/[^\d]/g,'')" v-model="dataForm.ze" placeholder=""></el-input> 元
          </el-form-item>
          <el-form-item label="发放周期">
            <el-input v-model="dataForm.zq" placeholder="发放周期"></el-input>
          </el-form-item>
          <el-form-item label="发放日期">
            <el-date-picker v-model="dataForm.ffrq" placeholder="发放日期" style="width:90%;" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
          </el-form-item>
        </el-form>

      </div>
      <div v-show="checkList.indexOf('季度奖') > -1">
        <el-form :inline="true" :model="dataForm1" class="form-inline">
          <el-form-item label="季度奖总额" label-width="123px">
            <el-input style="width: 90%" onkeyup="value=value.replace(/[^\d]/g,'')" v-model="dataForm1.ze" placeholder=""></el-input> 元
          </el-form-item>
          <el-form-item label="发放周期">
            <el-input v-model="dataForm1.zq" placeholder="发放周期"></el-input>
          </el-form-item>
          <el-form-item label="发放日期">
            <el-date-picker v-model="dataForm1.ffrq" placeholder="发放日期" style="width:90%;" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
          </el-form-item>
        </el-form>
      </div>
      <div v-show="checkList.indexOf('总经理嘉奖') > -1">
        <el-form :inline="true" :model="dataForm2" class="form-inline">
          <el-form-item label="总经理嘉奖总额" >
            <el-input style="width: 90%" onkeyup="value=value.replace(/[^\d]/g,'')" v-model="dataForm2.ze" placeholder=""></el-input> 元
          </el-form-item>
          <el-form-item label="发放周期">
            <el-input v-model="dataForm2.zq" placeholder="发放周期"></el-input>
          </el-form-item>
          <el-form-item label="发放日期">
            <el-date-picker v-model="dataForm2.ffrq" placeholder="发放日期" style="width:90%;" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
          </el-form-item>
        </el-form>
      </div>

      <el-table border :data="dataListYj" stripe width="99%" class="avue-crud" height="340px">
        <el-table-column prop="" label="序号" type="index" width="80"></el-table-column>
        <el-table-column prop="jgMc" label="机构"></el-table-column>
        <el-table-column v-if="checkList.indexOf('月奖') > -1" prop="yjje" label="月奖（元）"></el-table-column>
        <el-table-column v-if="checkList.indexOf('季度奖') > -1" prop="jjjje" label="季度奖（元）"></el-table-column>
        <el-table-column v-if="checkList.indexOf('总经理嘉奖') > -1" prop="zjjjj" label="总经理嘉奖（元）"></el-table-column>
        <el-table-column prop="hj" label="合计" :formatter="fHj"></el-table-column>
        <el-table-column prop="rjje" label="人均均额" :formatter="fRj"></el-table-column>
      </el-table>
      <div style="margin: 15px 0 15px 0">
        请于
        <el-date-picker v-model="dValue" placeholder="日期" style="width: 250px" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
        完成奖金上报工作
      </div>
      <div>
        具体工作要求： 上传附件
      </div>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: "jgPage",
  data() {
    return {
      visible: false,
      dataListYj: [],
      dValue: '',

      checkList: [],
      dataForm: {
        lxZeMc: "",
        ze: "",
        zq: "",
        ffrq: ''
      },
      dataForm1: {
        lxZeMc: "",
        ze: "",
        zq: "",
        ffrq: ''
      },
      dataForm2: {
        lxZeMc: "",
        ze: "",
        zq: "",
        ffrq: ''
      },
      bz: false
    }
  },
  methods: {
    init() {
      this.visible = true;
      this.false = false;
      this.bz = false;

      this.checkList = [];
      this.$nextTick(() => {
        this.dataForm.zq = "10月份";
        this.dataForm1.zq = "4季度";
        this.dataForm2.zq = "10月份";

        this.checkList = ["月奖", "季度奖", "总经理嘉奖"];

      })

      this.dataListYj = [
        {jgMc: "公司本部", yjje: "0.00", jjjje: "0.00", zjjjj: "0.00", hj: "0.00", rjje: "0.00"},
        {jgMc: "西安中心", yjje: "0.00", jjjje: "0.00", zjjjj: "0.00", hj: "0.00", rjje: "0.00"},
        {jgMc: "成都中心", yjje: "0.00", jjjje: "0.00", zjjjj: "0.00", hj: "0.00", rjje: "0.00"},
        {jgMc: "大庆中心", yjje: "0.00", jjjje: "0.00", zjjjj: "0.00", hj: "0.00", rjje: "0.00"},
        {jgMc: "北京业务部", yjje: "0.00", jjjje: "0.00", zjjjj: "0.00", hj: "0.00", rjje: "0.00"},
        {jgMc: "天津业务部", yjje: "0.00", jjjje: "0.00", zjjjj: "0.00", hj: "0.00", rjje: "0.00"},
        {jgMc: "吉林业务部", yjje: "0.00", jjjje: "0.00", zjjjj: "0.00", hj: "0.00", rjje: "0.00"}]
    },
    btnYs() {

      if (this.dataForm.ze.toString().trim() !== "") {
        const js = this.dataForm.ze;

        for (let j in this.dataListYj) {
          this.dataListYj[j].yjje = js;
        }
      }

      if (this.dataForm1.ze.toString().trim() !== "") {
        const js = this.dataForm1.ze;

        for (let j in this.dataListYj) {
          this.dataListYj[j].jjjje = js;
        }
      }

      if (this.dataForm2.ze.toString().trim() !== "") {
        const js = this.dataForm2.ze;

        for (let j in this.dataListYj) {
          this.dataListYj[j].zjjjj = js;
        }
      }

      this.dataListYj = [
        {jgMc: "公司本部", yjje: "120000", jjjje: "120000", zjjjj: "120000"},
        {jgMc: "西安中心", yjje: "130000", jjjje: "130000", zjjjj: "130000"},
        {jgMc: "成都中心", yjje: "14000", jjjje: "14000", zjjjj: "14000"},
        {jgMc: "大庆中心", yjje: "100000", jjjje: "100000", zjjjj: "100000"},
        {jgMc: "北京业务部", yjje: "200000", jjjje: "200000", zjjjj: "200000"},
        {jgMc: "天津业务部", yjje: "500000", jjjje: "500000", zjjjj: "500000"},
        {jgMc: "吉林业务部", yjje: "150000", jjjje: "150000", zjjjj: "150000"}]

      this.bz = true;
    },

    fHj(row, column, cellValue, index) {
      let lResult = 0

      if (this.checkList.indexOf('月奖') > -1) lResult += Number(row.yjje);
      if (this.checkList.indexOf('季度奖') > -1) lResult += Number(row.jjjje);
      if (this.checkList.indexOf('总经理嘉奖') > -1) lResult += Number(row.zjjjj);

      return lResult;
    },

    fRj(row, column, cellValue, index) {
      let lResult = 0
      let lReturn = 0;

      if (this.checkList.indexOf('月奖') > -1) lResult += 1;
      if (this.checkList.indexOf('季度奖') > -1) lResult += 1;
      if (this.checkList.indexOf('总经理嘉奖') > -1) lResult += 1;

      if (row.jgMc === "公司本部") {
        lReturn = 2000 * (this.bz ? lResult : 0);
      }
      if (row.jgMc === "西安中心") {
        lReturn = 2500 * (this.bz ? lResult : 0);
      }
      if (row.jgMc === "成都中心") {
        lReturn = 1300 * (this.bz ? lResult : 0);
      }
      if (row.jgMc === "大庆中心") {
        lReturn = 2000 * (this.bz ? lResult : 0);
      }
      if (row.jgMc === "北京业务部") {
        lReturn = 2000 * (this.bz ? lResult : 0);
      }
      if (row.jgMc === "天津业务部") {
        lReturn = 1800 * (this.bz ? lResult : 0);
      }
      if (row.jgMc === "吉林业务部") {
        lReturn = 1900 * (this.bz ? lResult : 0);
      }

      return lReturn;
    },


    //清空记录
    clearDataList() {
      this.dataForm = {
        lxZeMc: "",
        ze: "",
        zq: ""
      };
      this.visible = false;
    },

    btnYsa() {


      if (this.dataForm.ze.toString().trim() !== "") {

      }


      const js = this.dataForm1.ze;


      // for(let j in this.dataListJdj){
      //   this.dataListJdj[j].je = js;
      // }

      this.dataListYj = [{jgMc: "西安中心", je: "130000"},
        {jgMc: "成都中心", je: "14000"},
        {jgMc: "大庆中心", je: "100000"},
        {jgMc: "北京业务部", je: "200000"},
        {jgMc: "天津业务部", je: "500000"},
        {jgMc: "吉林业务部", je: "150000"}]


    },
    cChange(value) {
      ////console.log(value)

      // this.checkValues = "";
      // this.checkValues = this.checkList.join(',');

    },

  }
}
</script>

<style scoped>

</style>
